Picture Window Tutorial #1

 

          This tutorial is to help make it easier to learn picture windows. I know mirc.hlp for picture windows is rather stale, so I decided to make this to make it easier to understand.

 

A. What is a picture window?

 -A picture window is a complete customizable template to do anything on. Think of it as a painting canvas, the possibilities are endless. To add, there are many /draw commands. Some draw dots, rectangles, and more. Many people have a hard time with these, so this tutorial should help.

 

B. How do I open a picture window?

 -The /window command is used.

 -To make the most customizable type of picture window, switches will have to         be added in the /window command. My preference for a window opening command is this:

          /window –(b,B)dp +nd @name –1 –1 width height

Break down of the command:

 -/window: triggers the opening of a window

 -B switch: prevents window from using an inside border for custom control

 -b switch: uses a border. Choice between this or –B switch.

 -d switch: opens on the desktop for more capabilites

 -p switch: all picture windows MUST have this switch, or the /draw commands    wont register with the command.

 +n switch: minimizing capability.

 +d switch: no outside border for complete customizing control

 

Example: /window –bdp +nd @test –1 –1 100 100

The result should look something like this:

        

The border is automatic, that’s the window. The window background is the same as the color of your current mirc background.

 

C. You will need:

  1. Basic mIRC Knowledge
  2. Knowledge of dialogs or similar things.
  3. mIRC 6.x

 

In Depth Drawing Commands:

 

 

 

/drawdot

This command I generally don’t use that much, but many people will. The name does what it does, draws a dot anywhere you want on the window. The Command: /drawdot -ihnr @ <color> <size> <x y> [<x y>...]

Breakdown

Looks confusing, doesn’t it? To those who don’t know picture windows and are reading mirc.hlp at that, they usually turn back and think “I’ll just stick to dialogs.” Well, this tutorial will make it easier to learn that command.

Switches: There are 4 switches that are in this command. They are:

  1. –I means that the color you specify is inverse. Basically, inverse is that the color will slightly differ than the color you specify.
  2.  –h means that the window’s icon is highlighted if you minimize the window. Not used very much.
  3. –n switch is one of the best commands if you have a window with lots of things in it. Say you are adding 3 rectangles and a dot, instead of drawing them one by one, it waits until it has analyzed the command fully, and draws them all at the same time. Extremely useful for mirc games, since without this switch major flickering would occur. But you have to have this command at the end of your /draw codes alias: /drawdot @windowname. This tells the code that the drawing commands are done and to start drawing the items.
  4. –r switch is another useful switch. If you want another color than your 16 colors in mirc, you can use this switch to take any rgb color you want. But in the <color> section you MUST use the $rgb identifier or this command wont work right.

 

<color>, <size>, and dimensions: These are very important and critical to your drawing command. Do not neglect these.

  1. Color: This can be specified as either numbers 0-16(which will use your mirc colors) or $rgb(n,n,n) and the –r switch. The $rgb must use 3 numbers in the parentheses, from 0-255 for each number. $rgb(0,0,0) is black, where $rgb(255,0,0) is red.
  2. Size: This specifies the size of your draw item. For dots, a size of one will draw a very small dot, about 1x1 pixels. A size of 10 will be bigger, about 10x10 pixels. It goes like that for the rest.
  3. Dimensions: For dots, the dimensions are 2 numbers. The first number is the x axis, or how many pixels from the left the upper left corner of the dot will be placed. The second number is the y axis, or how many pixels from the top the upper right corner will be placed. The co-cordinantes, which are the ones in the [ ] on the command, are rarely used. However, when used, they draw multiple dots at one time.

 Examples

 This will include 3 examples for /drawdot.

 Example 1:

  1. Open the window with the command /window -bdp +nd @name –1 –1 100 100.
  2. In the editbox for the mirc window, type //drawdot @name 0 1 10 10. Most peoples “0” color is white, so the dot will be white, 1x1 pixels, and at cordinates 10x and 10y. The result should look like this:

as you can see, there is a small, white dot towards the top left corner of the window.

 

Example 2:

  1. Open the window with the command /window -bdp +nd @name –1 –1 100 100.
  2. In the editbox for the active mirc window, type //drawdot –r @name $rgb(0,0,0) 10 20 20. The color will be black, as specified with the –r switch. The size will be 10x10 pixels at cordinates 20x by 20y. The result should look like this:

 

as you can see, the dot is black, 10x10 and at 20x by 20y.

 

Example 3:

  1. Open the window with the command /window -bdp +nd @name –1 –1 100 100.
  2. In the editbox for the active mirc window, type //drawdot –ir @name $rgb(255,0,0) 5 20 20 80 80. There will be two dots drawn, both inverse of red, 5x5 pixels, and placed at their cordinates. The result will look like this:

as you can see, the color red slightly differs with the 2 dots drawn.

 

/drawline

This command is a great command for drawing shaded items in windows. Make an alias with four of these, 2 with one color and 2 with the other to form a rectangle, and you will get a 3d look of the object. This command draws a line starting from one coordinate and ending at another.

Command: /drawline -ihnr @ <color> <size> <x y> <x y> [<x y>...]

Breakdown

Now that you understand /drawdot, this is almost the same.

Switches: Same as /drawdot. Look at that command.

Color and size:

  1. Color is the same as /drawdot also.
  2. Size: Specify this number as the thickness of the line. A size of one would be 1 pixel tall, as a size of 10 would be 10 pixels tall.

 

Dimensions

  1. The dimensions for /drawline differ from /drawdot, but is easy to understand never the less. The first pair of x y axis cordinates specify where to start the line at. The second pari of x y axis cordinates specify where to end the line. So cordinates 10 10 20 20 would start the line at 10x by 10y and end at 20x by 20y. This would make a diagonal line.
  2. As in /drawdot, you can specify more dimenisions to draw multiple lines at once.

 

Examples

  1. Open the window with the command /window -bdp +nd @name –1 –1 100 100.
  2. Type //drawline @name 0 1 10 10 20 20 in the editbox in your active window. The result should look like this:

as you can see, there is a white line 1 pixel thick, drawn from 10x by 10y to 20x by 20y.

 

Example 2

  1. Open the window with the command /window -bdp +nd @name –1 –1 100 100.
  2. Type //drawline -r @name $rgb(0,255,0) 7 10 10 95 10 in the editbox in your active window. The result should look like this:

as you can see, there is a light green line 7 pixels thick, drawn from 10x by 10y to 95x to 10y. If the line is thick, the line gets rounded off, which I don’t like.

 

/drawrect

Most people refer to this command as the big daddy of picture windows. They are right. This command is so versitle, and can be used many ways. It basically draws a rectangle in the window specified.

Command: /drawrect -ihnrfecd @ <color> <size> <x y w h> [<x y w h>...]

Breakdown

This command differs from /drawdot and /drawline, mainly because of the switches and cordinates.

Switches

  1. The –f switch will fill the rectangle you draw with the color you specified. Without this switch, a rectangle is drawn with its lines the color you specified and the background color inside the rectangle. With it on, the whole rectangle is the color you specify, the lines and inside the lines.
  2. The –e switch acts as /drawdot in a way. It draws a circle or oval on the window instead of a rectangle, according to the specified cordinates.
  3. The –c switch draws the rectangle lines as dotted lines. Note: If this switch is specified, the –f switch will not work with it.
  4. The –d switch draws a rounded rectangle, according to the cordinates. You have to add in 2 more numbers at the end, which are x y numbers that stop rounding the corners at the cordinates specified. If you had a rounded rectangle with the two numbers as 5 and 5, it would round the corners of the rectangle, and the lines would be straight again at 5 up and 5 down from each corner.
  5. The rest of the switches are the same in /drawdot.

 

Colors and Size

  1. The color is the same in /drawdot and /drawline.
  2. The size is the thickness of the lines, like in /drawline.

 

Dimensions

  1. Different from the past two switches. You have to specify 4 points now. The first two points are the same as the last two commands, but the other two will specify how big the rectangle is. Example, if your four points were 10 10 10 10, then the upper left corner of the rectangle would begin at 10x and 10y, and will be 10 pixels wide and 10 pixels deep.
  2. Some switches call for 2 extra cordinates, so specify those as needed.
  3. Like the last two commands, you can draw more then one rectangle at once.

 

Examples

  1. Open a window with the command /window -bdp +nd @name –1 –1 100 100.
  2. In your active mirc window editbox, type //drawrect @name 0 1 10 10 10 10. The result should look like this:

as you can see, there is a white rectangle, with 1 pixel thick lines, positioned at 10x by 10y and 10 inches wide and 10 inches deep.

 

Example 2

  1. Open a window with the command /window -bdp +nd @name –1 –1 100 100.
  2. In your active mirc window editbox, type //drawrect –rf @name $rgb(0,0,255) 1 5 5 30 30. The result should look like this:

as you can see, the rectangle used the –f and –r switches. The rgb was blue, and the –f switch filled the rectangle with blue color. It is positioned at 5x by 5y and is 30 inches wide and 30 inches deep.

 

Example 3

  1. Open a window with the command /window -bdp +nd @name –1 –1 100 100.
  2. In your active mirc window editbox, type //drawrect –rd @name $rgb(0,128,255) 2 11 11 30 30 5 5. The result should look like this:

as you can see, the rectangle lighter blue, 2 pixel thick lines, and is rounded at the corners, straightening the lines at 5 pixels from the corners both ways.

 

 

/drawfill

This command can be useful in cases that involve circles. It fills an area at the specified cordinates, and acts like the paint bucket on ms paint. The filling stops at a line. Not particularly useful to fill rectangles, since it is easier just to use a /drawrect command with the –f switch.

Command: /drawfill -ihnrs @ <color> <color> <x y> [filename] [<x y>...]

Breakdown

This command is set up like /drawdot and /drawline.

Switches

  1. The –s switch is rather odd, and not particularly useful. Basically it gives the border of the filling the color of the second color specified. No example will be given for this switch.
  2. The rest are the same in /drawdot.

 

Colors and Dimensions

1.     Basically the same as /drawdot. You specify where the filling should start, but remember, the filling will act as a paint bucket and fill everything until it reaches the border or another line.

2.     Colors: You specify 2 colors here, one for the filling color and the other for the filling border(I believe, since I expierment this command all the time and the second color usually has no effect on the fill). Basically, the first color is the one you want to care about.

3.     Dimensions: Specify where to start filling. Simple as that.

 

Other

You can specify a bitmap to fill in. Just specify a filename after the first pair of dimensions. And, like in all the other commands, you can do more than one drawfill at once by inputting multiple coordinates.

 

Example

 

  1. Open a window with the command /window -bdp +nd @name –1 –1 100 100.
  2. In your active mirc editbox, type //drawfill –r @name $rgb(255,0,255) $rgb(0,0,0) 40 40. The result should look like this:

as you can see, the whole window is filled with a pink color. The reason for two colors remains a mystery to me, someone else might know what it does.

 

/drawtext

Very important switch. Does what the name implies, draws text into your window. There are many switches that alter the command. This is the most complex command of them all, but one of the best.

Command: /drawtext -hnrpboc @ <color> [color] [fontname fontsize] <x y [w h]> <text>

Breakdown

Different command from the last ones you have seen.

 

Whole Lot of New Switches

  1. The –p switch lets you use bold, underline, color, and more in your text. Useful if you are inputting text with more than one color.
  2. The –b switch works like mirc coloring. You specify a second color to be the background color for the text.
  3. The –o switch can be done without, since the –p switch supports it. It makes the text bolded.
  4. The –c switch: VERY IMPORTANT SWITCH. DO NOT NEGLECT IT. It acts as a box for the text. It works like /drawrect. You specify 2 extra cordinates, and that puts an imaginary box around the text, the box size being the two extra cordinates you put in. For example, if your cordinates were 10 10 20 10, your text would be positioned at 10x by 10y and would be cut off if its length was more than 20 pixels and thicker than 10 pixels. Useful for drawn buttons, editboxes, and more.
  5. The rest are the same in /drawdot.

 

Color and Font

  1. Color: Mostly the same as the other commands, unless the –b switch is turned on. The first color will make the text that color, but if the –b switch is on, the second color will be the background color for the text.
  2. Font: Specify a font for your text to be. Then, specify the size for the font, from 1-255.
  3. ***IMPORTANT*** If the font name you specify is more than one word, like Comic Sans MS, you MUST enclose the font name in quotes, like “Comic Sans MS”

 

Dimensions and Text

1.     The dimensions are also like the other commands. The first two switches specify where the font will be positioned. If the –c switch is turned on, the other two switches will make a cut-off box around the text.

2.     The text is just what you specify to be written. If your text was jach, then jach would be written in the window. If your text was $calc(7 –3), then 4 would be written in the window.

3.     Unlike the other commands, you cannot draw more than 1 text control at a time.

 

Examples

  1. Open a window with the command /window -bdp +nd @name –1 –1 100 100.
  2. In your active mirc editbox, type //drawtext @name 0 tahoma 10 10 10 Hello. The result should look like this:

As you can see, there is a white “hello” positoned at 10x by 10y in tahoma font, size 10.

 

Example 2

1.     Open a window with the command /window -bdp +nd @name –1 –1 100 100.

2.     In your active mirc editbox, type //drawtext -rc @name $rgb(255,255,0) century gothic 12 1 1 20 10 Hello I am Jach what are you doing.. The result should look like this:

as you can see, the text was to big to fit in a 20x by 10y box, so it cut cut off both ways. The Font is yellow, century gothic, size 10.

 

Example 3

1.     Open a window with the command /window -bdp +nd @name –1 –1 100 100.

2.     In your active mirc editbox, type //drawtext -rbc @name $rgb(0,128,0) $rgb(255,255,255) verdana 9 1 1 80 20 This is a picture window with text. The result should look like this:

as you can see, the command calls for green text with a white background, 9 size verdana positioned at 1x by 1y and in a 80x by 20y box. The text is too big, so it got cut off.

 

 

/drawpic

This command draws a .png, .bmp, and more into your window. Useful for adding “icons” into your windows, games, and other things.

Command: /drawpic -ihmntscl @ [color] <x y [w h]> [x y w h] <filename>

Breakdown

 

Switches

1.     The –m switch changes the picture quality when the bitmap is stretched/shrunken. Not particularly useful unless you have specified the –s switch also.

2.     The –s switch streches/squeezes the bitmap, according to the w and h cordinates you specify.

3.     The –l switch tiles the picture, like wallpaper tiling.

4.     The –c switch caches the bitmap. Speeds up bitmap loading in the future.

5.     The –t switch gives the bitmap a transparent background, according do the color you specify.

 

Dimensions and Filename

1.     The dimensions are simple, the x and y cordinates you specify are where the picture will be positioned. The w and h cordinates go with some switches, but are not used in standard /drawpic. You can specify a second pair of x y w h, which will make an imaginary box around that bitmap’s cordiantes and than only show that portion of the bitmap.

2.     The Filename is what you specify to be loaded in the window. For example, C:\My Documents\picture.bmp would be specified, and loaded in the window.

 

Example

1.     I opened a window with the command /window -bdp +nd @name –1 –1 100 100.

2.     I typed in my active mirc window editbox //drawpic @name 0 0 C:\My Documents\picture.bmp. The result looked like this:

as you can see, the picture of picture.bmp was loaded at cordinates 0x by 0y.

 

/drawscroll

This command is particularly useless, but some people may use it for things, but I don’t know. Its included since it has some significance some lesser draw commands don’t have. What it does is takes one part of the window and moves it to another part of the window.

Command: /drawscroll -hn @ <x> <y> <x y w h> [<x> <y> <x y w h>...]

Breakdown

 

Dimensions

The dimensions here can be tricky and an extreme pain in the ass. What they are is the first 2 cordinates specify how many pixels the part to-be-scrolled will be scrolled. The other four specify what part of the window will be scrolled. And like all others you can scroll more then one thing at once.

 

Example

1.     Open a window with the command /window -bdp +nd @name –1 –1 100 100.

2.     In your active mirc editbox, type //drawrect –r @name $rgb(255,0,0) 2 5 5 20 20.

3.     In your active mirc editbox, type //drawscroll @name 10 10 0 0 25 25. The outcome should look like this:

as you can see, the region of the window 0,0,25,25 was scrolled to 10x by 10y. This is one of my weaker commands that I rarely use, so this is all.

 

/drawrot

Command that does what it says, rotates an area of a bitmap in a picture window. ***NOTE: BITMAP***. I also don’t use this command either, but since it deals with @window GUI I am going to include it.

Command: /drawrot -hmnbfc @ [color] <angle> [x y w h]

Breakdown

 

Switches

1.     The –b switch is like the –b in /drawtext, gives a background color to the rotated bitmap.

2.     The –f switch sizes the bitmap to make it fit in the original width/height.

3.     The –c switch will center the bitmap, but it wont work if you have the –f switch on.

4.     The –m switch is like in /drawpic, it changes the quality of the bitmap when resized.

 

Angle and Dimensions

1.     The angle is self-explanitory. Specify an angle from 1-359 degrees.

2.     The Dimensionsa are optional, they are specified if you only want a part of the bitmap rotated.

 

Example

1.     I opened a window with the command Open a window with the command /window -bdp +nd @name –1 –1 100 100.

2.     I typed in my active mirc window editbox //drawpic @name 0 0 C:\My Documents\picture.bmp.

3.     I typed in my active mirc window editbox //drawrot @name 90. The result looked like this:

as you can see, the bitmap of the smiley face was rotated 90 degrees.

 

Other Drawing Commands

These commands are not in depth.

They are not in depth because they are not used much(at least by me), or generally don’t have a use in mirc GUI construction.

 

/drawsave

Command: /drawsave -bNqN @ <filename>

Action: This saves the background picture of the specified picture @window to a .bmp filename.

Note: Can use JPEGs, maybe useful for mirc games.

 

/drawcopy

Command: /drawcopy -ihmnt @ [color] <x y w h> @ <x y [w h]>

Action: Copies a section of one window and is pasted into another or the same window.

Note: Useful for mirc games to get bitmaps and things out of “cache” windows, otherwise not really useful at all.

 

/drawreplace

Command: /drawreplace -nr @ <color1> <color2> [x y w h]

Action: Replaces color1 with color2 in the specified picture window.

Note: I generally don’t see the point of this command. It changes colors in a window, that’s it.

 

End of the Tutorial

Next Version should include:

·        Menu Commands

·        Custom Controls, such as progress bars, editboxes, and more

·        GUI Explanation

·        Window Customization

 

Thanks To:

·        #ScriptaZ and scriptaz.com, for some of the users making me do this

·        sean_, iak_, and Beast_Of_Burden, for tips

·        blankrap and devdev, for suggesting to do examples

·        #mircscripts.org and mircscripts.org: Good database of scripters and people who will appreciate this tutorial

·        Khaled, for making mIRC.

 

Written by quickman, from December 17-19, 2002.

Find me on: irc.scriptaz.com, #Scriptaz Nick: quickman

Enjoy this J